<template>

    <vue-table :data-source="tableList" :search-config="searchConfig">
        <template slot="search" scope="props">
            <i-input v-model="props.items.keyword" placeholder="请输入关键字"></i-input>
        </template>
        <template slot="header">
            <tr>
                <th>ID</th>
                <th>代码</th>
                <th>名称</th>
                <th>结束时间</th>
                <th>作者身份</th>
                <th>排序</th>
                <th>操作</th>
            </tr>
        </template>
        <template slot="tbody" scope="props">
            <tr>
                <td>{{props.item.id}}</td>
                <td>{{props.item.code}}</td>
                <td>{{props.item.name}}</td>
                <td>{{props.item.pivot.end_at}}</td>
                <td>{{props.item.pivot.type}}</td>
                <td>{{props.item.pivot.sort}}</td>
                <td class="col-lg-2">
                    <Tooltip content="编辑" v-if="user.can('create-edit-data')" placement="top">
                        <i-button type="text" v-on:click="showEditDialog(props.item.pivot.id)" :disabled="stateManager.buttonLoading">
                            <Icon type="edit" size="16"></Icon>
                        </i-button>
                    </Tooltip>
                    <Tooltip content="删除" v-if="user.can('create-edit-data')" placement="top">
                        <i-button type="text" v-on:click="deleteModel(props.item.pivot.id, props.item.name)" :disabled="stateManager.buttonLoading">
                            <Icon type="trash-a" size="16"></Icon>
                        </i-button>
                    </Tooltip>
                </td>
            </tr>
        </template>

    </vue-table>

</template>

<script>
    export default {
        props: {
            stateManager: {
                type: Object
            },
            awardId: {
                type: [Number , String]
            }
        },
        data: function () {
            return {
                list: this.$listDataSource({
                    url: 'api/award/company/' + this.awardId
                }),
                searchConfig: {
                    items: {
                        keyword: ''
                    },
                    status: true,
                    complex: false
                },
                model: this.$modelDataSource({
                    url: 'api/award/award-company/' + this.awardId,
                    dataKey: 'model',
                    attributes: {
                        id: 0,
                        name: ''
                    }
                })
            };
        },
        methods: {
            showEditDialog: function (id) {
                this.stateManager.editModelId = id;
                this.stateManager.buttonLoading = true;
            },
            deleteModel: function (modelId, modelName) {
                let self = this;
                this.$Modal.confirm({
                    title: '删除确认',
                    content: '确认删除' + modelName + '吗，删除后无法恢复',
                    loading: true,
                    onOk: function () {
                        self.model.reset();
                        self.model.uuid = modelId;
                        self.model.destroy(function () {
                            self.$Modal.remove();
                            self.stateManager.refreshList = true;
                            self.$Notice.success({
                                title: '删除成功',
                                desc: modelName + '已删除'
                            })
                        });
                    },
                    onCancel: function () {
                        console.log('取消删除');
                    }
                });
            }
        },
        computed: {
            user(){
                return this.$store.state.user;
            },
            tableList(){
                let self = this;
                if (this.stateManager.refreshList) {
                    this.list.fetch({}, function () {
                        self.stateManager.refreshList = false;
                    });
                }
                return this.list;
            }
        }
    }
</script>